<template>
  <van-tabbar v-model="active" active-color="#FD7753" route>
    <van-tabbar-item :icon="active == '/' ? home1 : home" to="/" name="/"
      >首页</van-tabbar-item
    >
    <van-tabbar-item
      :icon="active == '/job' ? company1 : company"
      to="/job"
      name="/job"
      >岗位</van-tabbar-item
    >
    <van-tabbar-item
      :icon="active == '/mine' ? mine1 : mine"
      to="/mine"
      name="/mine"
      >我的</van-tabbar-item
    >
  </van-tabbar>
</template>

<script setup lang="ts">
import { ref } from "vue";
import { useRoute } from "vue-router";
import home from "../assets/img/home_icon.png";
import home1 from "../assets/img/home_icon_act.png";
import company from "../assets/img/company_icon.png";
import company1 from "../assets/img/company_icon_act.png";
import mine from "../assets/img/mine_icon.png";
import mine1 from "../assets/img/mine_icon_act.png";
const active = ref("/");
const route = useRoute(); //此处的route就相当于原本的this.$route
// console.log(route);
setTimeout(() => {
  active.value = route.path;
  console.log(active.value);
}, 300);
</script>

<style scoped></style>
